<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <table border="1" cellspacing="0" style="width:300px;">
        <tr>
            <td><input type="checkbox" onchange="quan(this)">全选</td>
            <td>名称</td>
            <td>单价</td>
        </tr>
        <tr>
            <td><input type="checkbox" name="one">1</td>
            <td>篮球</td>
            <td>300.0</td>
        </tr>
        <tr>
            <td><input type="checkbox" name="one">2</td>
            <td>足球</td>
            <td>200.0</td>
        </tr>
        <tr>
            <td><input type="checkbox" name="one">3</td>
            <td>网球</td>
            <td>100.0</td>
        </tr>
    </table>

    <script>
        function quan(all){
           var arr = document.getElementsByName("one");
           for(var i=0; i<arr.length; i++){
               arr[i].checked = all.checked; //将全选框的状态，赋值给每一个复选框
           }
       }
       /* 3.getElementsByTagName：通过标签名称获得元素节点对象集 */
       //案例：表格隔行变色
       var rows = document.getElementsByTagName("tr"); //通过标签名获取元素对象集合
       for(var i=0; i<rows.length; i++){
           if(i % 2 == 1 ){//奇数
              rows[i].style.backgroundColor = "pink";
           }
       }
    </script>
</body>
</html>